<!doctype html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>稻草人-水稻病虫害防治系统-首页</title>
	<meta name="renderer" content="webkit|ie-comp|ie-stand">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport"
		content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
	<meta http-equiv="Cache-Control" content="no-siteapp" />

		<!-- 自定义目录下css -->
		<link rel="stylesheet" href="../static/css/font.css">
		<link rel="stylesheet" href="../static/css/xadmin.css">
		<!-- layui css -->
		<link rel="stylesheet" href="../static/lib/layui/css/layui.css">
		
		<!-- layui admin css -->
		<link rel="stylesheet" href="../static/lib/layuiadmin/lib/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="../static/lib/layuiadmin/lib/layui/css/admin.css" media="all">
		<!-- <link rel="stylesheet" href="../static/lib/layuiadmin/lib/layui/css/layui_old.css" media="all"> -->
		<link rel="stylesheet" href="../static/lib/layuiadmin/style/admin.css" media="all">


		<!-- 引用的js -->
		<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
		<script src="../static/lib/layui/layui.js" charset="utf-8"></script>
		<script type="text/javascript" src="../static/js/xadmin.js"></script>

		<!-- css of bootstrap 不需要就别乱引用,会导致出错-->
	
<!-- 		<link href="https://how2j.cn/study/css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
		<script src="https://how2j.cn/study/js/bootstrap/3.3.6/bootstrap.min.js"></script> -->

</head>

<body>


		<ul class="layui-nav" lay-filter="">
			<li class="layui-nav-item"><img src="../static/images/four.png" class="head-img" /> </li>
			<li class="layui-nav-item layui-this"><a href="main.html">系统首页</a></li>
			<li class="layui-nav-item"><a href="pest_dict.html">虫害百科</a></li>
			<li class="layui-nav-item"><a href="pest_warn.html">虫害预警</a></li>
			<li class="layui-nav-item">
				<a href="javascript:;">用户主页</a>
				<dl class="layui-nav-child">
					<!-- 二级菜单 -->
					<dd><a href="user_center.html">用户信息</a></dd>
					<dd><a href="">搜索记录</a></dd>
					<dd><a href="index.html">退出登录</a></dd>
				</dl>
			</li>
			<li class="layui-nav-item"><a href="user_comments.html">用户反馈</a></li>
		</ul>
	<!-- 顶部结束 -->





	<!-- 中部开始 -->


	<div>
		<div class="layui-fluid">
			<div class="layui-row layui-col-space15">
				<div class="layui-col-md4">
					<div class="layui-card">
						<div class="layui-card-header">用户信息</div>
						<div class="layui-card-body">
							<table class="layui-table">
								<colgroup>
									<col width="100">
									<col>
								</colgroup>
								<tbody>
									<tr>
										<td>用户名</td>
										<td>
											123456789
										</td>
									</tr>
									<tr>
										<td>用户姓名</td>
										<td>
											张三
										</td>
									</tr>
									<tr>
										<td>联系方式</td>
										<td>123456789</td>
									</tr>
									<tr>
										<td>用户所在地区</td>
										<td>北京</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="layui-card">
						<div class="layui-card-header">病虫害诊断步骤</div>
						<div class="layui-card-body">
							<ul class="layui-timeline">
								<li class="layui-timeline-item">
									<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
									<div class="layui-timeline-content layui-text">
										<h3 class="layui-timeline-title">步骤1——个人信息</h3>
										<p>首次登录的用户，可前往“我的账户——基本资料”界面完善您的信息。
											<br>需要修改个人信息的用户，请前往“我的账户——基本资料”界面修改您的信息。
										</p>
									</div>
								</li>
								<li class="layui-timeline-item">
									<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
									<div class="layui-timeline-content layui-text">
										<h3 class="layui-timeline-title">步骤2——虫害识别</h3>
										<p>请点击“上传图片”按钮将您需要识别的水稻图片上传至我们的系统，再点击“开始上传”按钮开始识别，识别结果会显示在我们的主页。</p>
									</div>
								</li>
								<li class="layui-timeline-item">
									<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
									<div class="layui-timeline-content layui-text">
										<h3 class="layui-timeline-title">步骤3——客服咨询</h3>
										<p>识别结束后，若您还有任何问题，请进入“客服咨询”在留言框内进行留言咨询，我们会尽快回复。
										</p>
									</div>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="layui-col-md8">
					<div class="layui-card">
						<div class="layui-card-header">上传图片</div>
						<div class="layui-card-body">
							<!--方式1对应代码-->
							<div class="layui-upload">
								<button type="button" class="layui-btn" id="test1">上传图片</button> <button type="button"
									class="layui-btn layui-btn-normal" id="test9">开始上传</button>
								<div class="layui-upload-list">
									<img class="layui-upload-img" id="demo1" style="width:100px">
									<p id="demoText"></p>

								</div>
							</div>
						</div>
					</div>
					<div class="layui-row layui-col-space15">
						<div class="layui-col-md5">
							<div class="layui-card">
								<div class="layui-card-header">
									示例图片
								</div>
								<div class="layui-card-body">
									<img id="" src="../static/images/稻曲病.jpg" height="350" width="380">
								</div>
							</div>
						</div>
						<div class="layui-col-md7">
							<div class="layui-card">
								<div class="layui-card-header">
									病虫害识别结果及防治方法
								</div>
								<div class="layui-card-body">
									<!-- PID06识别结果再加准确率 -->
									<div class="layui-elem-quote layui-quote-nm"
										style="background-color:cornflowerblue;width:650px;height:100px">
										<div style="color:white;font-size: 30px" id="result">识别结果:稻曲病</div><br>
										<div style="color:white;font-size: 20px">准确率:60%</div><br>
										<div class="layui-progress" lay-showPercent="yes" lay-filter="accuracy">
											<div class="layui-progress-bar " lay-percent="0%" id="accuracy1"
												style="background-color:darkblue;width:{{accuracy}}%;">
												<h class="layui-progress-text" id="accuracy2"
													style="color:white;font-size:20px"></h>
											</div>
										</div>


									</div>
									<div class="layui-row">
										<div class="layui-col-md7">
											<div class="cmdlist-container">
												<a id="选中条目" href="/wiki/details?病名=" cursor="pointer">
													<img id="百科图片" src="" height="300">
												</a>
											</div>

										</div>
										<div class="layui-col-md5" style="text-align: center;">
											<p style="font:700 30px bold;color: black;margin-top: 40%;margin-left: 50%;"
												id="百科提示"></p>
										</div>
									</div>

								</div>
							</div>
						</div>
					</div>

				</div>

			</div>
			<div class="layui-row layui-col-space15">
				<div class="layui-card">
					<div class="layui-card-header">
						病虫害情况统计图
						<div class="layui-btn-group layuiadmin-btn-group">
							<a href="javascript:;" class="layui-btn layui-btn-primary layui-btn-xs">去年</a>
							<a href="javascript:;" class="layui-btn layui-btn-primary layui-btn-xs">今年</a>
						</div>
					</div>
					<div class="layui-card-body">
						<div class="layui-row">
							<div class="layui-col-sm8">
								<div>
									<img src="../static/images/病虫害统计.jpg" height="400" width="800">
								</div>
							</div>

						</div>
					</div>
				</div>
			</div>
		</div>
	</div>


	<!-- 中部结束 -->




	<!-- 底部开始 -->
	<div class="footer">
		<div class="copyright">Copyright ©2021 蜜雪冰城项目组 v2.3 All Rights Reserved</div>
	</div>
	<!-- 底部结束 -->
	<script>

	</script>
</body>

</html>